<script setup>
import { useRouter, useRoute } from 'vue-router'

const router = useRouter()

function goto(routeName) {
  router.push({name:routeName,params: { username: '张三' },query: { age: 18 } })
}

function generateRoute() {
  router.addRoute({ path: '/ai', component: () => import('./views/AI.vue') })
}

</script>

<template>
    
  <el-icon :size="20">
    <Edit />
  </el-icon>
  <el-icon color="#409EFC" class="no-inherit">
    <Share />
  </el-icon>
  
  <button @click="generateRoute">动态路由</button>
  <el-button type="primary" @click="generateRoute">Primary</el-button>
  <br>
  <router-link to="/news">新闻</router-link>
  &nbsp;&nbsp;&nbsp;
  <router-link to="/game">游戏</router-link>
  &nbsp;&nbsp;&nbsp;
  <router-link to="/tieba">贴吧</router-link>
  &nbsp;&nbsp;&nbsp;
  <router-link to="/ai">AI</router-link>

  <br>
  <button @click="goto('news')">新闻</button>

  &nbsp;&nbsp;&nbsp;
  <router-link to="/game">游戏</router-link>
  &nbsp;&nbsp;&nbsp;
  <router-link to="/tieba">贴吧</router-link>

  <router-view></router-view>

</template>

<style scoped>
</style>
